import 'package:flutter/material.dart';
import 'package:flutter_base/config/app_color.dart';
import 'package:flutter_base/generated/assets.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:flutter_base/base/widget/base_get_builder.dart';
import 'package:flutter_base/widgets/button/common_button.dart';
import 'package:flutter_base/widgets/appbar/common_app_bar.dart';
import 'package:flutter_base/widgets/image/auto_image.dart';
import 'package:flutter_base/widgets/textfield/custom_text_field.dart';
import 'reset_password_logic.dart';

class ResetPasswordPage extends StatelessWidget {
  final logic = Get.put(ResetPasswordLogic());

  ResetPasswordPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return BaseGetBuilder<ResetPasswordLogic>(
      backgroundColor: const Color(0xFFF5F7FA),
      appBar: CommonAppBar(
        title: '',
        showLeft: true,
        leadingImage: Assets.arrowBackWhite,
        leadingImageColor: AppColor.color0C0A09,
      ),
      extendBodyBehindAppBar: true,
      builder: (_) {
        return Stack(
          children: [
            // 背景图
            const Positioned.fill(
              child: AutoImage(
                Assets.accountBg,
                fit: BoxFit.fitWidth,
                alignment: Alignment.topCenter,
              ),
            ),

            SafeArea(
              child: SingleChildScrollView(
                child: Padding(
                  padding: EdgeInsets.symmetric(horizontal: 24.w),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      SizedBox(height: 24.w),
                      _buildHeader(),
                      SizedBox(height: 32.w),
                      _buildPasswordInput(),
                      SizedBox(height: 32.w),
                      _buildConfirmPasswordInput(),
                      SizedBox(height: 56.w),
                      _buildResetButton(),
                    ],
                  ),
                ),
              ),
            ),
          ],
        );
      },
    );
  }

  // 顶部标题和说明
  Widget _buildHeader() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          'Set a new password',
          style: TextStyle(
            fontSize: 28.sp,
            fontWeight: FontWeight.w600,
            color: AppColor.color0C0A09,
          ),
        ),
        SizedBox(height: 12.w),
        Text(
          'Please reset your password again',
          style: TextStyle(
            fontSize: 14.sp,
            fontWeight: FontWeight.w500,
            color: const Color(0xFF7F909F),
          ),
        ),
      ],
    );
  }

  // 密码输入框
  Widget _buildPasswordInput() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          'New password',
          style: TextStyle(
            fontSize: 16.sp,
            fontWeight: FontWeight.w600,
            color: AppColor.color0C0A09,
          ),
        ),
        SizedBox(height: 8.w),
        CustomTextField(
          textEditingController: logic.passwordController,
          focusNode: logic.passwordFocusNode,
          obscureText: !logic.isPasswordVisible,
          hintText: 'Please enter your password',
          backgroundColor: Colors.white,
          hasError: logic.passwordHasError,
          errorText: logic.passwordErrorText,
          right: GestureDetector(
            onTap: logic.togglePasswordVisibility,
            child: Icon(
              logic.isPasswordVisible ? Icons.visibility : Icons.visibility_off,
              size: 20.w,
              color: const Color(0xFF7F909E),
            ),
          ),
        ),
      ],
    );
  }

  // 确认密码输入框
  Widget _buildConfirmPasswordInput() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          'Confirm password',
          style: TextStyle(
            fontSize: 16.sp,
            fontWeight: FontWeight.w600,
            color: AppColor.color0C0A09,
          ),
        ),

        SizedBox(height: 8.w),
        CustomTextField(
          textEditingController: logic.confirmPasswordController,
          focusNode: logic.confirmPasswordFocusNode,
          obscureText: !logic.isConfirmPasswordVisible,
          hintText: 'Please confirm your password',
          backgroundColor: Colors.white,
          hasError: logic.confirmPasswordHasError,
          errorText: logic.confirmPasswordErrorText,
          right: GestureDetector(
            onTap: logic.toggleConfirmPasswordVisibility,
            child: Icon(
              logic.isConfirmPasswordVisible
                  ? Icons.visibility
                  : Icons.visibility_off,
              size: 20.w,
              color: const Color(0xFF7F909E),
            ),
          ),
        ),
      ],
    );
  }

  // 重置按钮
  Widget _buildResetButton() {
    return CommonButton.expend(
      title: 'Complete',
      type: logic.isButtonEnabled ? ButtonType.primary : ButtonType.disabled,
      onClick: logic.isButtonEnabled ? logic.resetPassword : null,
    );
  }
}
